<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:cc="http://java.sun.com/jsf/composite">
    <!-- INTERFACE -->
    <cc:interface>
        <cc:attribute name="formName" required="true"/>
    </cc:interface>
    <!-- IMPLEMENTATION -->
    <cc:implementation>
        <f:view>
            <h:form id="addNewEventForm">
                <h2><h:outputLabel value="#{cc.attrs.formName}" /></h2>
                <h:outputText style="font-weight: bold" value="Event Name: " />
                <h:inputText required="true" requiredMessage="Field is required." id="eventName" value="#{eventManagerBean.eventName}">
                    <f:ajax event="keyup" render="ajaxmsg" listener="#{eventManagerBean.doAjaxCountEventNameLength}" />
                    <f:validateLength minimum="4" maximum="16" />
                </h:inputText>
                <h:outputLabel styleClass="infoMsg" id="ajaxmsg" value="#{eventManagerBean.eventNameLength}" />
                <h:message styleClass="errorMsg" for="eventName" />
                <br/>
                <h:outputText style="font-weight: bold" value="Start Date/Time: " />
                <h:inputText required="true" requiredMessage="Field is required." id="startDateTime" value="#{eventManagerBean.startDateTime}">
                    <f:validateLength minimum="19" maximum="19" />
                </h:inputText>
                <h:message styleClass="errorMsg" for="startDateTime" />
                <br/>
                <h:outputText style="font-weight: bold" value="End Date/Time: " />
                <h:inputText required="true" requiredMessage="Field is required." id="endDateTime" value="#{eventManagerBean.endDateTime}">
                    <f:validateLength minimum="19" maximum="19" />
                </h:inputText>
                <h:message styleClass="errorMsg" for="endDateTime" />
                <br/>
                <h:outputText style="font-weight: bold" value="Venue: " />
                <h:inputText required="true" requiredMessage="Field is required." id="venue" value="#{eventManagerBean.venue}">
                    <f:validateLength minimum="1" maximum="4" />
                </h:inputText>
                <h:message styleClass="errorMsg" for="venue" />
                <br/>
                <h:outputText style="font-weight: bold" value="System User: " />
                <h:inputText required="true" requiredMessage="Field is required." id="systemUser" value="#{eventManagerBean.systemUser}">
                    <f:validateLength minimum="1" maximum="4" />
                </h:inputText>
                <h:message styleClass="errorMsg" for="systemUser" />
                <br/><br/>
                <h:commandButton action="saveNewEvent.xhtml" value="Save New Event" actionListener="#{eventManagerBean.saveNewEvent}" />
            </h:form>
        </f:view>
    </cc:implementation>
</html>